{{ define "content" }}
    {{ partial "svg_sprite_icons/aqxc" }}
    {{ partial "svg_sprite_icons/number_square" }}
    <main class="pb-5 container-xxl" id="main">
        {{ .Content }}
        <div class="d-flex flex-column align-items-center">
            <ol class="small fw-bold text-secondary-emphasis">
                <li>工具仅限测试使用，请勿传播</li>
                <li>使用需要单独授权，联系方式参见最后提示</li>
                <li>请理解，没有完美的辅助工具，请合理使用</li>
                <li><span class="text-danger">登录账号和资料中的手机号必须为同一号码</span></li>
                <li>
                    <ul class="list-unstyled">
                        <li class="text-info">使用时间:</li>
                        <li><svg class="bi me-2 text-info" width="16" height="16"><use href="#bi-1-square"></use></svg>5 月 1 日 — 11 月 30 日</li>
                        <li><svg class="bi me-2 text-info" width="16" height="16"><use href="#bi-2-square"></use></svg>每天 05:00 - 23:00</li>
                    </ul>
                </li>
                <li><span class="user-select-none">微信号：</span><span class="text-warning-emphasis">JZEG-NET</span></li>
            </ol>
        </div>
        <div class="mx-auto py-5 col-12 col-md-10 col-lg-8 col-xxl-6">
            <form class="d-flex flex-column row-gap-2 mb-4" id="aqxc_form">
                <div>
                    <div class="form-floating">
                        <input type="text" class="form-control user-select-none" name="account" id="aqxc_account" placeholder="手机号" autocomplete="off" minlength="11" maxlength="11" required>
                        <label for="aqxc_account">
                            <svg class="me-1 text-body-secondary bi"><use href="#bi-phone"></use></svg>
                            手机号
                        </label>
                    </div>
                    <label for="aqxc_account" class="form-text">
                        <span class="user-select-none">当前账号：</span>
                        <span id="account_display">未设置</span>
                    </label>
                </div>
                <div>
                    <div class="form-floating">
                        <input type="text" class="form-control user-select-none" name="token" id="token" placeholder="访问令牌" autocomplete="off" required>
                        <label for="token">
                            <svg class="me-1 text-body-secondary bi"><use href="#bi-key-fill"></use></svg>
                            访问令牌
                        </label>
                    </div>
                    <label for="token" class="form-text">
                        <span class="user-select-none">当前访问令牌：</span>
                        <span class="text-break" id="token_display">未设置</span>
                    </label>
                </div>
                <div>
                    <div class="d-grid row-gap-1">
                        <button type="reset" class="ms-auto btn btn-link link-danger link-underline-opacity-0 btn-outline-secondary">删除当前</button>
                        <button type="submit" class="btn btn-success">保 存</button>
                    </div>
                    <div class="form-text">
                        <span>保存成功后，点击下方刷新按钮，获取最新数据。</span>
                    </div>
                </div>
            </form>
            <div class="mb-3" id="result">
                <div class="px-2 py-3 d-flex flex-column row-gap-3 border border-secondary-subtle rounded" id="userInfo">
                    <div class="d-flex flex-row">
                        <div class="grid row-gap-2 column-gap-0 text-nowrap">
                            <span class="g-col-3 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">昵称：</span>
                            <span class="g-col-8 text-truncate" id="user_nickname"></span>
                            <span class="g-col-3 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">姓名：</span>
                            <span class="g-col-8" id="user_real_name"></span>
                            <span class="g-col-3 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">手机号：</span>
                            <span class="g-col-8" id="user_mobile"></span>
                            <span class="g-col-3 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">有效期：</span>
                            <span class="g-col-8" id="user_validity"></span>
                        </div>
                        <div class="ms-auto" style="width: 90px;">
                            <img class="w-100 img-thumbnail rounded-circle bg-secondary-subtle" id="user_avatar"
                                 src=""
                                 alt="头像">
                        </div>
                    </div>
                    <hr class="my-0 text-opacity-50">
                    <div class="d-flex">
                        <div class="grid row-gap-2 column-gap-0">
                            <span class="g-col-5 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">今日安全B：</span>
                            <span class="g-col-7" id="user_power"></span>
                            <span class="g-col-5 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">当月积分：</span>
                            <span class="g-col-7" id="user_points"></span>
                            <span class="g-col-5 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">累计积分：</span>
                            <span class="g-col-7" id="user_total_points"></span>
                        </div>
                        <button type="button" class="ms-auto btn btn-sm btn-outline-success rounded-4 refreshInfo" data-refresh="profile">刷新</button>
                    </div>
                    <hr class="my-0 text-opacity-50">
                    <div class="d-flex">
                        <div class="grid row-gap-2 column-gap-0">
                            <span class="g-col-5 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">学习时长：</span>
                            <span class="g-col-7" id="user_totalTime"></span>
                            <span class="g-col-5 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">观看数量：</span>
                            <span class="g-col-7" id="user_studyStats"></span>
                            <span class="g-col-5 text-nowrap font-monospace user-select-none" style="text-align-last: justify;">观看次数：</span>
                            <span class="g-col-7" id="user_visitStats"></span>
                        </div>
                        <button type="button" class="ms-auto btn btn-sm btn-outline-warning rounded-4 refreshInfo" data-refresh="video">刷新</button>
                    </div>
                    <hr class="my-0 text-opacity-50">
                    <div class="d-grid gap-2 col-4 col-xl-3 mx-auto">
                        <button type="button" class="btn btn-sm btn-outline-danger rounded-3" id="sign_in">签到</button>
                    </div>
                </div>
            </div>
            <div class="d-flex flex-column row-gap-2 fs-5">
                <div class="d-flex column-gap-3 link-underline-opacity-0">
                    <a class="link-danger" href="quiz" target="_blank">答题竞赛</a>
                    <a class="link-danger" href="study" target="_blank">视频学习</a>
                    <a class="link-danger" href="read/article" target="_blank">阅读文章</a>
                </div>
                <div class="d-flex column-gap-3 link-underline-opacity-0">
                    <a class="link-info" href="top/quiz" target="_blank">竞赛排行榜</a>
                    <a class="link-info" href="top/study" target="_blank">学习排行榜</a>
                </div>
                <div class="d-flex column-gap-3 link-underline-opacity-0">
                    <a class="link-info" href="stat/quiz" target="_blank">竞赛明细</a>
                    <a class="link-info" href="stat/study" target="_blank">学习报告</a>
                </div>
                <div class="d-flex column-gap-3 link-underline-opacity-0">
                    <a class="link-success" href="records/quiz" target="_blank">竞赛记录</a>
                    <a class="link-success" href="records/study" target="_blank">学习记录</a>
                </div>
                <div class="d-flex column-gap-3 link-underline-opacity-0">
                    <a class="link-danger" href="questions" target="_blank">知识题库</a>
                </div>
                <div class="d-flex column-gap-3 link-underline-opacity-0">
                    <a class="link-warning" href="study/batch" target="_blank">批量操作</a>
                    <a class="link-warning" href="favourite" target="_blank">我的收藏</a>
                </div>
            </div>
        </div>
    </main>
{{ end }}